<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Weex Preview</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-touch-fullscreen" content="yes">
  <meta name="format-detection" content="telephone=no, email=no">
  <link rel="stylesheet" href="./assets/style.css">
  <script src="./config.js"></script>
  <script src="./assets/url.js"></script>
  <script src="./assets/qrcode.js"></script>
  <script src="./node_modules/vue/dist/vue.js"></script>
</head>
<body>
<h1>Weex Preview</h1>
<div id="app"></div>
<template id="app-template">
  <div id="app">
    <div class="mock-phone">
      <div class="inner">
        <iframe id="preview" src="./web/index.html"></iframe>
      </div>
      <div class="camera"></div>
      <div class="earpiece"></div>
      <div class="home-btn"></div>
    </div>
    <div id="qrcode">
      <h2>QRCode</h2>
      <a :href="val" target="_blank">
        <canvas ref="canvas" width="200" height="200"></canvas>
      </a>
      <p class="bundle-url"><a :href="val" target="_blank">{{val}}</a></p>
    </div>
  </div>
</template>
<script>
  console.log('QR CODE URL: ' + url)
  new Vue({
    el: '#app',
    template: '#app-template',
    data: {val: 'http://192.168.10.122:8888/android/app/build/outputs/apk/app-syswin-release.apk'},
    mounted () {
      let qrcodedraw = new QRCodeLib.QRCodeDraw()
      qrcodedraw.draw(this.$refs.canvas, this.val, function () {
      })
    }
  })
</script>
</body>
</html>
